<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" type="text/css" href="Styles/bootstrap.min.css" />
    <script type="text/javascript" src="Scripts/jquery.min.js"></script>
    <script type="text/javascript" src="Scripts/bootstrap.min.js"></script>
    <style type="text/css">
        .main{
            width: 500px;
            margin-left: 45px;
        }
        .left{
            width: 250px;
            float: left;
        }
        .right{
            width: 250px;
            height: 300px;
            float: right;
        }
        .image{
            width: 200px;
            height: 200px;
            margin-top: 70px;
            margin-left: 20px;
            border:1px solid #000;
        }
        img{
         width: 200px;
         height: 200px;
        }
        tr{
            height: 33px;
        }
    </style>
</head>
<body>
<div class="main">
    <div class="left">
        <h2>个人信息</h2>
        <form>
            <table >
                <tr>
                    <td>登录名:</td>
                    <td><input type="text" name="" value="${userInfo.username }"></td>
                </tr>
                <tr>
                    <td>真实姓名:</td>
                    <td><input type="text" name="" value="${userInfo.uname }"></td>
                </tr>
                <tr>
                    <td>所在部门:</td>
                    <td><input type="text" name="" value=${userInfo.seabout }></td>
                </tr>
                <tr>
                    <td>性别:</td>
                    <td><input type="text" name="" value="${userInfo.usex }"></td>
                </tr>
                <tr>
                    <td>职称:</td>
                    <td><input type="text" name="" value="${userInfo.ujob }"></td>
                </tr>
                <tr>
                    <td>角色:</td>
                    <td><input type="text" name="" value="${userInfo.rolename }"></td>
                </tr>
                <tr>
                    <td>状态:</td>
                    <td><input type="text" name="" value="${userInfo.ustate }"></td>
                </tr>
                
            </table>       
        </form>
        <button class="btn btn-info" id="updatePassWord">修改密码</button>
    </div>
    <div class="right">
        <div class="image">
        <img alt="" src="head-portrait/${userInfo.uhead }">
        </div>
       
    </div>
    
    <div>
       <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
                    <h4 class="modal-title" id="myModalLabel">修改密码</h4>
                </div>
                <div class="modal-body">
                    请输入新密码<input type="password" name="passWord" id="passWord">
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>           
                    <button type="button" class="btn btn-primary" data-dismiss="modal" id="submit">提交更改</button>
                </div>
            </div><!-- /.modal-content -->
        </div><!-- /.modal -->
    </div>
</div>
		<script type="text/javascript">
			$(function() {
				$("#update").click(function() {
					console.log("dsfaf");
					window.location.href = "Template/updateInformation.jsp";
				})

				 $("#updatePassWord").click(function () {
	    	           $("#myModal").modal("show");
	    	       });
				
				$("#submit").click(function(){
					var passWord = $("#passWord").val();
					console.log(passWord);
					$.ajax({
						url:'changePassWord',
						type:'post',
						data:{'passWord':passWord},
						dataType:'json',
						success : function(result){
							if(result==true){
								alert("修改成功")
							}
						}
					})
				})

			})
		</script>
	</body>
</html>